<template>
        <Cascader v-if="organizationList.length>0" style="width:200px;" :data="organizationList" trigger="click" @on-change="changeOrganType" ></Cascader>
    </template>
<script>
    import configService from 'service/configService.js'
    export default {
        name: 'organizationGroup',
        data() {
            return {
                organizationList: []
            }
        },
        created() {
            this.getOrganizationList()
        },
        methods: {
            async getOrganizationList() {
                let organizationList = await configService.getOrganizationList()
                let data = this.getOrganRecursive(organizationList)
                this.organizationList = data

            },
            getOrganRecursive(data) {
                let result = [],
                    temp
                if (Array.isArray(data) && data.length > 0) {
                    data.map((val, i) => {
                        val.value = val.id
                        val.label = val.text
                        if (Array.isArray(val.children) && val.children.length > 0) {
                            temp = this.getOrganRecursive(val.children)
                            if (temp.length > 0) {
                                val.children = temp
                            }
                            result.push(val)
                        } else {
                            val.children = []
                            result.push(val)
                        }
                    })

                }
                return result
            },
            changeOrganType(organArr, selectedData) {
                let data = {
                    'value': organArr,
                    'selectedData': selectedData
                }
                this.$emit('changeOrganType', data)
            }
        }
    }
</script>